<!DOCTYPE html>
<html>
	<head>
		  <meta charset="utf-8">
		  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		  <title>ZooHouse动物园场馆管理系统</title>
		  <link rel="stylesheet" href="./layui/css/layui.css">
	</head>
	<body background="/imgs/background.jpg">
		<div class="layui-layout layui-layout-admin" >
		  <div class="layui-header ">
			  
			  <!-- logo -->
			<div class="layui-logo layui-hide-xs layui-bg-green">
				<img src="imgs/logo.png" width="200" height="55" >
			</div>
			<!-- 头部区域,显示标题 -->
			<ul class="layui-nav layui-layout-left " style="margin-top: 20px;">
			  <!-- 移动端显示 -->
			  <li class="layui-nav-item layui-show-xs-inline-block layui-hide-sm " lay-header-event="menuLeft">
				<i class="layui-icon layui-icon-spread-left"></i>
			  </li>
			  <!-- 标题 -->
			  <label style="color: whrite; font-size: 28px; font-family: 华文行楷;">动物园场馆管理系统</label>
			</ul>
			
			<ul class="layui-nav layui-layout-right">
			  <li class="layui-nav-item layui-hide layui-show-md-inline-block">
				<a href="javascript:;">
				  <img src="imgs/photo.jpg" class="layui-nav-img">
				  user
				</a>
				<dl class="layui-nav-child">
				  <dd><a href="person-information.html" target="mainFrame">个人信息</a></dd>
				  <dd><a href="">登出</a></dd>
				</dl>
			  </li>
			  
			</ul>
		  </div>
		  
		  <div class="layui-side layui-bg-black">
			<div class="layui-side-scroll">
			  <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
			  <ul class="layui-nav layui-nav-tree" lay-filter="test">
				  
				<li class="layui-nav-item ">
				  <a class="" href="javascript:;">场馆管理</a>
				  <dl class="layui-nav-child">
					<dd><a href="stadium-add.html" target="mainFrame">添加场馆</a></dd>
					<dd><a href="stadium-select.html" target="mainFrame">查询场馆</a></dd>
					<dd><a href="stadium-list.html" target="mainFrame">场馆信息</a></dd>
				  </dl>
				</li>
				
				<li class="layui-nav-item">
				  <a href="javascript:;">动物管理</a>
				  <dl class="layui-nav-child">
					<dd><a href="animal-add.html" target="mainFrame">添加动物</a></dd>
					<dd><a href="animal-select.html" target="mainFrame">查询动物</a></dd>
					<dd><a href="animal-list.html" target="mainFrame">动物列表</a></dd>
				  </dl>
				</li>
				
				<li class="layui-nav-item">
				  <a href="javascript:;">设备管理</a>
				  <dl class="layui-nav-child">
					<dd><a href="decive-add.html" target="mainFrame">添加设备</a></dd>
					<dd><a href="decive-select.html" target="mainFrame">查询设备</a></dd>
					<dd><a href="decive-list.html" target="mainFrame">设备列表</a></dd>
				  </dl>
				</li>
				
				<li class="layui-nav-item"><a href="aboutus.html" target="mainFrame">关于我们</a></li>
				
			  </ul>
			</div>
		  </div>
		  
		  <div class="layui-body" >
			<!-- 内容主体区域 -->
			<div style="padding: 5px;">
				<iframe width="100%" height="750" name="mainFrame" src=""></iframe>
			</div>
		  </div>
		  
			<div class="layui-footer">
		  		<!-- 底部固定区域 -->
		  		<p style="font-family: 华文行楷;">没有买卖，就没有伤害，1823动物园欢迎您的到来</p>
			</div>
		</div>
		<script src="./layui/layui.js"></script>
		<script>
		//JS 
		layui.use(['element', 'layer', 'util'], function(){
		  var element = layui.element
		  ,layer = layui.layer
		  ,util = layui.util
		  ,$ = layui.$;
		  
		  //头部事件
		  util.event('lay-header-event', {
			//左侧菜单事件
			menuLeft: function(othis){
			  layer.msg('展开左侧菜单的操作', {icon: 0});
			}
		  });
		  
		});
		</script>
	</body>
</html>